<template>
  <div class="lishi">
    <van-cell v-for="(item, index) in 6" :key="index">
      <!-- 使用 title 插槽来自定义标题 -->
      <template #title>
        <!-- 标题 -->
        <h2>湖人总冠军</h2>
        <!-- 图片 -->
        <van-grid :border="false" :column-num="3">
          <van-grid-item>
            <van-image
              src=""
            />
          </van-grid-item>
          <van-grid-item>
            <van-image
              src=""
            />
          </van-grid-item>
          <van-grid-item>
            <van-image
              src="https://ss1.bdstatic.com/70cFvXSh_Q1YnxGkpoWK1HF6hhy/it/u=3480511073,1797317790&fm=26&gp=0.jpg"
            />
          </van-grid-item>
        </van-grid>
        <!-- 作者,评论,事件 -->
        <div class="yongjian">
          <span class="zuo">辰馨与神墓</span>
          <span class="ping">100评论</span>
          <span class="shi">12个月前</span>
        </div>

        <!-- 评论,点赞,分享 -->
        <van-grid :column-num="3" direction="horizontal">
          <van-grid-item icon="comment-o" text="评论" />
          <van-grid-item icon="like-o" text="点赞" />
          <van-grid-item icon="certificate" text="分享" />
        </van-grid>
      </template>
    </van-cell>
  </div>
</template>

<script>
export default {}
</script>


<style lang="less" scoped>
.shouc {
  margin-top: 46px;
  .nav-main {
    background-color: #3e9df8;
    /deep/ .van-nav-bar__title {
      color: #fff;
    }
  }
  /deep/ i.van-icon.van-icon-arrow-left.van-nav-bar__arrow,
  /deep/ .van-nav-bar__text {
    color: #fff;
  }
  .heng {
    display: flex;
  }
  .yongjian {
    color: #b2b2b2;
    .ping {
      margin: 0 15px;
    }
  }
}
</style>

